<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
  <script src="../../web-component-tester/browser.js"></script>
  <link rel="import" href="../../iron-list/iron-list.html">
  <link rel="import" href="../../test-fixture/test-fixture.html">

  <link rel="import" href="helpers.html">
  <link rel="import" href="../vaadin-grid.html">
</head>

<body>

  <test-fixture id="default">
    <template>
      <vaadin-grid style="width: 200px; height: 200px;" size="1000">
        <vaadin-grid-column>
          <template>[[index]]</template>
        </vaadin-grid-column>
      </vaadin-grid>
      <iron-list></iron-list>
    </template>
  </test-fixture>

  <script>
    describe('iron list', () => {
      let grid, ironList;

      beforeEach(done => {
        grid = fixture('default')[0];
        ironList = fixture('default')[1];
        grid.dataProvider = infiniteDataProvider;
        flushGrid(grid);
        animationFrameFlush(done);
      });

      it('should work with another iron-list on the page', () => {
        expect(grid.$ && ironList.is).to.equal('iron-list');
      });

      it('should warn when using iron-list APIs trough grid', () => {
        const _warn = console.warn;
        const spy = console.warn = sinon.spy();
        grid.firstVisibleIndex;
        grid.lastVisibleIndex;
        console.warn = _warn;
        expect(spy.callCount).to.be.above(1);
      });

    });

  </script>

</body>

</html>
